<!-- 意见征集消息详情 -->
<template>
	<view class="page">
		<view style=" background-color: #fff; padding: 20rpx; border-radius: 20rpx; margin-bottom: 20rpx;"  v-if="hingerOpinionList && hingerOpinionList.length">
			<view class="content">
				上级签发意见
			</view>
			<view class="text" v-for="(item, index) in hingerOpinionList" :key="index">
				<text>{{item.empId_dictText}}：</text>
				<text>{{item.opinion}}</text>
			</view>
		</view>
		<view style=" background-color: #fff; padding: 20rpx; border-radius: 20rpx; margin-top: 20rpx; margin-bottom: 20rpx;" v-if="lowerOpinionList && lowerOpinionList.length">
			<view class="content">
				下级签发意见
			</view>
			<view class="text" v-for="(item, index) in lowerOpinionList" :key="index">
				<text>{{item.empId_dictText}}：</text>
				<text>{{item.opinion}}</text>
			</view>
		</view>
		<view style=" background-color: #fff; padding: 20rpx; border-radius: 20rpx; margin-top: 20rpx;">
			<view class="content">
				签发栏
			</view>
			<u-form :model="model" :rules="rules" labelPosition="top" ref="opinionForm" labelWidth="auto" :labelStyle="{
			  fontSize: '14px',
			  color: '#B2B2B2',
			  lineHight: '20px'
			}">
			  <u-form-item label="签发意见" required prop="opinion">
			  	<u--textarea :confirm-type="null" maxlength="500" count required
						placeholder="（签发部门）示例：请**部门/人于**月**日前完成**工作。
（被签发部门）示例：已于**月**日完成***工作，请知悉。" 
			  		v-model="model.opinion"></u--textarea>
			  </u-form-item>
				<u-form-item label="反馈意见" required prop="feedbackOpinion">
					<u--textarea :confirm-type="null" maxlength="500" count required
						placeholder="请输入本级反馈意见"
						v-model="model.feedbackOpinion"></u--textarea>
				</u-form-item>
				<view class="">
				  <view class="basic-title basic-border">签发接收人</view>
				  <view class="py-1 space-y-1" style="width: 100%">
						<u-button size="small" type="primary" @click="pickShow = true">{{selectedPersonNum?'我已选择' : '我未选择'}}</u-button>
				  </view>
				</view>
			</u-form>
		</view>
		<view class="space-x-1 px-1 btn_position"  style="left: 0;">
			<u-button type="primary" :plain="true" text="返回" @click="onReturn"></u-button>
			<u-button type="primary" :disabled="isSubmit" text="签发" @click="onIssue"></u-button>
		</view>
		<view style="height: 100rpx"></view>
		<u-toast ref="uToast"></u-toast>
		<u-picker :show="pickShow" :closeOnClickOverlay="true" ref="uPicker" :columns="columns" @confirm="confirm" @cancel="pickShow = false" @close="pickShow = false"></u-picker>
	</view>
</template>

<script>
	import { mapState } from 'vuex'
	import {
		messageInfoReadId, // 消息已读
	} from '../../api/index.js'
	import fileList from '../synergy/components/fileList.vue'
	import http from '@/utils/request'
	export default {
		data() {
			return {
				isSubmit: false,
				id: '', // 详情id
				messageDetail: {}, // 消息详情
				hingerOpinionList:[], //上级签发意见list
				lowerOpinionList:[],//下级签发意见list
				model: {
					opinion: '',
					feedbackOpinion: ''
				},
				rules: {
					opinion: [{ required: true, message: '请输入签发意见!', trigger: ['blur', 'change'] }],
					feedbackOpinion: [{ required: true, message: '请输入本级反馈意见!', trigger: ['blur', 'change'] }],
				},
				columns: [
					[{
							text: '公司架构',
							id: '1'
					}, {
							text: '联系人小组',
							id: '2'
					}]
				],
				pickShow: false
			}
		},
		components: {
			fileList
		},
		async onLoad(options) {
			this.id = options.id || ''
			this.detail(this.id)
			this.getHingerOpinionList() // 获取上级意见
			this.getLowerOpinionList() // 获取下级意见
			this.getSelectUsers() // 获取下级意见
			this.getRead() // 获取消息详情已读
		},
		computed: {
		  ...mapState(['userInfo']),
			// 监听数据
			selectedPersonNum () {
				if (this.$store.state.selectPerson && this.$store.state.selectPerson.length) {
					return this.$store.state.selectPerson.length
				} else {
					return 0
				}
			}
		},
		onBackPress(options) {
			// 清空选择通知公告选择的人员
			if (this.$store.state.selectPerson) {
				this.$store.dispatch('actionsSetSelectPerson', '')
			}
		},
		methods: {
			confirm(e) {
				const value = e.value[0]
				if(value.id=='1'){
					this.selectPerson()
				} else {
					this.selectContact()
				}
				this.pickShow = false
			},
			async detail(id) {
				// 获取详情
				if (!id) {
					return false
				} 
				http.get('/api/erp/publishCollect/queryPageById', { id }).then(res => {
					if (res.success) {
						this.messageDetail = res.result.records[0]
					}
				})
			},
			// 获取上级签发意见
			getHingerOpinionList () {
				http.get('/api/erp/publishCollect/emp/hingerOpinionList', { empId: this.userInfo.empId, collectId: this.id }).then(res => {
					if (res.success) {
						this.hingerOpinionList = res.result.records
					}
				})
			},
			// 获取下级签发意见
			getLowerOpinionList () {
				http.get('/api/erp/publishCollect/emp/hingerLowerList', { empId: this.userInfo.empId, collectId: this.id }).then(res => {
					if (res.success) {
						this.lowerOpinionList = res.result.records
					}
				})
			},
			// 获取选中的接收人
			async getSelectUsers(id){
				let params = {
						collectId: this.id,
						pageNo:1,
						pageSize:-1,
						empId: this.userInfo.empId
					}
					let res = await http.get('/api/erp/publishCollect/findEmpUserSelect',params)
					if(res.success){
						this.$store.state.selectPerson = res.result.records || []
					}else{
						this.$store.state.selectPerson = []
					}
			},
			getRead () {
				var params = {
					empId: this.userInfo.empId,
					collectId: this.id
				}
				http.get('/api/erp/publishCollect/read', params).then(res => {
					if (res.success) {
						// 阅读成功
					}
				})
			},
			selectPerson(){
				uni.navigateTo({
					url:'/pages/docManage/selectReceiver'
				})
			},
			selectContact(){
				uni.navigateTo({
					url:'/pages/docManage/selectContactGroup'
				})
			},
			validateForm() {
				return this.$refs.opinionForm.validate().then(async () => {
					return Promise.resolve()
				})
			},
			// 签发
			async onIssue () {
				var that = this
				await this.validateForm()
				this.isSubmit = true
				let selectEmpList = await JSON.parse(JSON.stringify(this.$store.state.selectPerson))
				selectEmpList = await selectEmpList.map(rr=>{
					return {
						empId: rr.empId,
						empDepartIds: rr.departId,
						username: rr.username,
						realname: rr.realname,
					}
				})
				var params = await {
					empId: this.userInfo.empId,
					id: this.id,
					opinion: this.model.opinion,
					feedbackOpinion: this.model.feedbackOpinion,
					selectEmpList
				}
				http.post('/api/erp/publishCollect/signEmp', params).then(res => {
					if (res.success) {
						this.$refs.uToast.show({
						  message: res.message,
						  type: 'default',
						  complete() {
								uni.navigateBack()
								that.isSubmit = false
						  }
						})
					} else {
						that.isSubmit = false
						uni.showToast({
							title: res.message,
							icon: 'none'
						})
					}
				}).catch(err => {
					that.isSubmit = false
				})
			},
			onReturn () {
				uni.navigateBack()
			}
		}
	}
</script>

<style lang="scss" scoped>
	@import url('@/assets/inputStyle.scss');
	page{
		// background-color: #FFFFFF;
	}
.page{
	padding: 20rpx;
	.content{
		// text-align: center;
		font-size: 16px;
		font-family: PingFangSC-Medium, PingFang SC;
		font-weight: 600;
		color: #171717;
		// margin-top: 30rpx;
	}
	.text{
		margin-top: 32rpx;
		font-size: 14px;
		font-family: PingFangSC-Light, PingFang SC;
		font-weight: 300;
		color: #7F7F7F;
	}
	.time{
		margin: 8rpx 0 32rpx 0;
		font-size: 14px;
		font-family: PingFangSC-Light, PingFang SC;
		font-weight: 300;
		color: #7F7F7F;
	}
	.parase{
		white-space: normal;
	}
}
</style>
